import { StyleSheet } from 'react-native'

export const leaveStyles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#f5f5f5',
    },
    formContainer: {
        paddingTop: 20,
        paddingHorizontal: 16,
        paddingBottom: 48,
    },
    scrollView: {
        flex: 1,
    },
    form: {
        padding: 16,
    },
    title: {
        fontSize: 22,
        fontWeight: 'bold',
        textAlign: 'center',
        marginBottom: 16,
        color: '#333',
    },
    card: {
        borderRadius: 8,
        marginBottom: 16,
        elevation: 2,
        shadowColor: '#000',
        shadowOffset: { width: 0, height: 2 },
        shadowOpacity: 0.1,
        shadowRadius: 4,
    },
    sectionTitle: {
        fontSize: 18,
        fontWeight: 'bold',
        marginBottom: 16,
        color: '#333',
    },
    noDateContainer: {
        backgroundColor: '#f8f9fa',
        borderRadius: 8,
        padding: 16,
        borderWidth: 1,
        borderColor: '#dee2e6',
        alignItems: 'center',
        justifyContent: 'center',
        marginTop: 8,
    },
    fieldContainer: {
        marginTop: 12,
        marginBottom: 4,
    },
    label: {
        fontWeight: '600',
        marginBottom: 8,
        fontSize: 16,
        color: '#333',
    },
    subLabel: {
        fontSize: 14,
        fontWeight: 'bold',
        marginTop: 12,
        marginBottom: 8,
        color: '#555',
    },
    textInput: {
        borderWidth: 1,
        borderColor: '#ddd',
        borderRadius: 12,
        backgroundColor: '#fff',
        paddingHorizontal: 12,
        paddingVertical: 12,
        fontSize: 16,
        lineHeight: 22,
        flex: 1,
        marginBottom: 8,
        minHeight: 50,
        textAlignVertical: 'center',
    },
    textArea: {
        borderWidth: 1,
        borderColor: '#ddd',
        borderRadius: 8,
        padding: 12,
        fontSize: 16,
        lineHeight: 24,
        minHeight: 100,
        backgroundColor: '#fff',
        textAlignVertical: 'top',
    },
    regionSelector: {
        flexDirection: 'row',
        justifyContent: 'space-between',
        alignItems: 'center',
        borderWidth: 1,
        borderColor: '#ddd',
        borderRadius: 8,
        padding: 12,
        backgroundColor: '#fff',
        flex: 1,
        minHeight: 50,
    },
    regionSelectorText: {
        fontSize: 16,
        lineHeight: 22,
        color: '#333',
        flex: 1,
    },
    regionSelectorPlaceholder: {
        color: '#999',
    },
    dateButton: {
        borderWidth: 1,
        borderColor: '#ddd',
        borderRadius: 8,
        backgroundColor: '#fff',
        padding: 12,
        marginBottom: 8,
        minHeight: 50,
        justifyContent: 'center',
    },
    dateButtonText: {
        fontSize: 16,
        lineHeight: 22,
        color: '#333',
    },
    arrayItem: {
        flexDirection: 'column',
        marginBottom: 10,
        gap: 10,
    },
    deleteButton: {
        backgroundColor: '#ff4444',
        paddingHorizontal: 12,
        paddingVertical: 8,
        borderRadius: 6,
    },
    deleteButtonContainer: {
        justifyContent: 'center',
        alignItems: 'center',
        alignSelf: 'center',
        marginTop: 8,
    },
    circularDeleteButton: {
        width: 40,
        height: 40,
        borderRadius: 20,
        backgroundColor: '#ff4444',
        justifyContent: 'center',
        alignItems: 'center',
        elevation: 3,
        shadowColor: '#000',
        shadowOffset: { width: 0, height: 2 },
        shadowOpacity: 0.25,
        shadowRadius: 3.84,
    },
    deleteButtonText: {
        color: '#fff',
        fontSize: 20,
        fontWeight: 'bold',
        lineHeight: 20,
    },
    addButtonContainer: {
        alignItems: 'center',
        marginTop: 10,
        marginBottom: 10,
    },
    circularAddButton: {
        width: 40,
        height: 40,
        borderRadius: 25,
        backgroundColor: '#007AFF',
        justifyContent: 'center',
        alignItems: 'center',
        elevation: 3,
        shadowColor: '#000',
        shadowOffset: { width: 0, height: 2 },
        shadowOpacity: 0.25,
        shadowRadius: 3.84,
    },
    addButton: {
        backgroundColor: '#007AFF',
        paddingHorizontal: 16,
        paddingVertical: 10,
        borderRadius: 8,
        flexDirection: 'row',
        alignItems: 'center',
        justifyContent: 'center',
        marginTop: 10,
        gap: 8,
    },
    addButtonText: {
        color: '#fff',
        fontSize: 16,
        fontWeight: 'bold',
    },
    reasonContainer: {
        marginVertical: 4,
    },
    reasonTypeContainer: {
        padding: 12,
        marginBottom: 8,
    },
    checkboxContainer: {
        backgroundColor: 'transparent',
        borderWidth: 0,
        marginLeft: 0,
        marginRight: 0,
        paddingVertical: 4,
    },
    detailContainer: {
        marginLeft: 20,
        marginTop: 10,
        padding: 16,
        backgroundColor: '#f8f9fa',
        borderRadius: 8,
    },
    itemContainer: {
        marginBottom: 16,
        padding: 12,
        backgroundColor: '#fff',
        borderRadius: 12,
        borderWidth: 0,
        shadowColor: 'transparent',
        shadowOffset: {
            width: 0,
            height: 0,
        },
        shadowOpacity: 0,
        shadowRadius: 0,
        elevation: 0,
    },
    pickerContainer: {
        borderWidth: 1,
        borderColor: '#ddd',
        borderRadius: 12,
        backgroundColor: '#fff',
        marginBottom: 8,
        minHeight: 50,
        justifyContent: 'center',
        overflow: 'hidden',
    },
    picker: {
        height: 55,
        paddingVertical: 0,
        paddingHorizontal: 12,
        fontSize: 16,
        color: '#333',
        backgroundColor: 'transparent',
    },
    radioContainer: {
        backgroundColor: 'transparent',
        borderWidth: 0,
        marginLeft: 0,
        marginRight: 0,
        paddingVertical: 4,
    },
    errorText: {
        color: '#ff4444',
        fontSize: 12,
        marginTop: 4,
    },
    submitButtonContainer: {
        paddingHorizontal: 16,
        paddingTop: 20,
        paddingBottom: 40,
        backgroundColor: '#fff',
    },
    submitButton: {
        backgroundColor: '#007AFF',
        borderRadius: 8,
        paddingVertical: 15,
    },
    totalDaysContainer: {
        borderWidth: 1,
        borderColor: '#ddd',
        borderRadius: 8,
        backgroundColor: '#f8f9fa',
        padding: 12,
        marginBottom: 8,
    },
    totalDaysText: {
        fontSize: 16,
        color: '#333',
        textAlign: 'center',
        fontWeight: 'bold',
    },
    attachmentContainer: {
        marginTop: 10,
        padding: 12,
        backgroundColor: '#f8f9fa',
        borderRadius: 8,
        borderWidth: 1,
        borderColor: '#e0e0e0',
    },
    attachmentText: {
        fontSize: 12,
        color: '#666',
        marginBottom: 10,
        textAlign: 'center',
    },
    uploadButton: {
        backgroundColor: '#007AFF',
        paddingHorizontal: 16,
        paddingVertical: 10,
        borderRadius: 8,
        alignItems: 'center',
    },
    uploadButtonText: {
        color: '#fff',
        fontSize: 16,
        fontWeight: 'bold',
    },
    approvalContainer: {
        padding: 12,
        backgroundColor: '#f8f9fa',
        borderRadius: 8,
        borderWidth: 1,
        borderColor: '#e0e0e0',
        minHeight: 50,
        justifyContent: 'center',
    },
    approvalText: {
        fontSize: 14,
        color: '#666',
        textAlign: 'center',
        fontStyle: 'italic',
    },
    formActions: {
        marginTop: 30,
        padding: 15,
        borderTopWidth: 1,
        borderTopColor: '#ebeef5',
        flexDirection: 'column',
        gap: 15,
    },
    actionItem: {
        flexDirection: 'row',
        alignItems: 'center',
        justifyContent: 'space-between',
        paddingVertical: 8,
    },
    descriptionItem: {
        paddingVertical: 4,
        paddingHorizontal: 8,
        backgroundColor: '#f8f9fa',
        borderRadius: 6,
        borderLeftWidth: 3,
        borderLeftColor: '#409EFF',
    },
    descriptionText: {
        fontSize: 13,
        color: '#666',
        fontStyle: 'italic',
    },
    actionLabel: {
        fontSize: 14,
        color: '#333',
        marginBottom: 5,
    },
    selectButton: {
        backgroundColor: '#007AFF',
        paddingHorizontal: 12,
        paddingVertical: 8,
        borderRadius: 6,
    },
    selectButtonText: {
        color: '#fff',
        fontSize: 14,
        fontWeight: 'bold',
    },
    selectedLeadersContainer: {
        marginTop: 10,
        padding: 12,
        backgroundColor: '#f0f7ff',
        borderRadius: 8,
        borderWidth: 1,
        borderColor: '#409EFF',
    },
    selectedLeadersTitle: {
        fontSize: 14,
        fontWeight: 'bold',
        color: '#409EFF',
        marginBottom: 8,
    },
    selectedLeaderItem: {
        flexDirection: 'row',
        justifyContent: 'space-between',
        alignItems: 'center',
        paddingVertical: 6,
        paddingHorizontal: 8,
        backgroundColor: '#fff',
        borderRadius: 6,
        marginBottom: 4,
        borderWidth: 1,
        borderColor: '#e0e0e0',
    },
    selectedLeaderText: {
        fontSize: 14,
        color: '#333',
        flex: 1,
    },
    removeLeaderButton: {
        width: 24,
        height: 24,
        borderRadius: 12,
        backgroundColor: '#ff4444',
        justifyContent: 'center',
        alignItems: 'center',
    },
    removeLeaderText: {
        color: '#fff',
        fontSize: 16,
        fontWeight: 'bold',
    },
    // 请假事由选择相关样式
    selectedReasonsContainer: {
        marginTop: 10,
        padding: 16,
        alignItems: 'center',
        marginBottom: 10,
    },
    selectedReasonsText: {
        fontSize: 12,
        color: '#409EFF',
        fontWeight: '500',
        marginBottom: 12,
        textAlign: 'center',
    },
    confirmButton: {
        backgroundColor: '#409EFF',
        paddingHorizontal: 24,
        paddingVertical: 12,
        borderRadius: 8,
        minWidth: 120,
        alignItems: 'center',
        justifyContent: 'center',
    },
    confirmButtonText: {
        color: '#fff',
        fontSize: 16,
        fontWeight: 'bold',
    },
    // 请假事由详细页面样式
    header: {
        flexDirection: 'row',
        justifyContent: 'space-between',
        alignItems: 'center',
        paddingHorizontal: 16,
        paddingVertical: 12,
        backgroundColor: '#fff',
        borderBottomWidth: 1,
        borderBottomColor: '#e5e5e5',
    },
    backButton: {
        fontSize: 16,
        color: '#409EFF',
    },
    headerTitle: {
        fontSize: 18,
        fontWeight: '600',
        color: '#333',
    },
    saveButton: {
        backgroundColor: '#409EFF',
        paddingHorizontal: 20,
        paddingVertical: 12,
        borderRadius: 8,
        alignItems: 'center',
        justifyContent: 'center',
        flex: 1,
        elevation: 2,
        shadowColor: '#000',
        shadowOffset: { width: 0, height: 2 },
        shadowOpacity: 0.25,
        shadowRadius: 3.84,
    },
    saveButtonContainer: {
        padding: 16,
        backgroundColor: '#fff',
        borderTopWidth: 1,
        borderTopColor: '#e5e5e5',
    },
    saveButtonText: {
        fontSize: 16,
        color: '#fff',
        fontWeight: '600',
    },
    buttonContainer: {
        flexDirection: 'row',
        padding: 16,
        backgroundColor: '#fff',
        borderTopWidth: 1,
        borderTopColor: '#e5e5e5',
        gap: 12,
    },
    resetButton: {
        backgroundColor: '#ff6b6b',
        paddingHorizontal: 20,
        paddingVertical: 12,
        borderRadius: 8,
        alignItems: 'center',
        justifyContent: 'center',
        flex: 1,
        elevation: 2,
        shadowColor: '#000',
        shadowOffset: { width: 0, height: 2 },
        shadowOpacity: 0.25,
        shadowRadius: 3.84,
    },
    resetButtonText: {
        fontSize: 16,
        color: '#fff',
        fontWeight: '600',
    },
    reasonTabs: {
        backgroundColor: '#fff',
        borderBottomWidth: 1,
        borderBottomColor: '#e5e5e5',
        paddingVertical: 0,
        paddingHorizontal: 0,
    },
    reasonTab: {
        paddingHorizontal: 16,
        paddingVertical: 16,
        marginHorizontal: 0,
        borderRadius: 0,
        backgroundColor: 'transparent',
        borderBottomWidth: 2,
        borderBottomColor: 'transparent',
        minWidth: 80,
        alignItems: 'center',
    },
    activeReasonTab: {
        backgroundColor: 'rgba(230, 247, 255, 1)',
        borderBottomColor: '#409EFF',
    },
    reasonTabText: {
        fontSize: 16,
        color: '#666',
        fontWeight: '400',
    },
    activeReasonTabText: {
        color: '#409EFF',
        fontWeight: '600',
    },
    reasonFormContainer: {
        padding: 16,
    },
    reasonFormTitle: {
        fontSize: 18,
        fontWeight: 'bold',
        color: '#333',
        marginBottom: 8,
    },
    reasonFormDescription: {
        fontSize: 14,
        color: '#666',
        marginBottom: 20,
    },
    formPlaceholder: {
        padding: 40,
        backgroundColor: '#f9f9f9',
        borderRadius: 8,
        alignItems: 'center',
        justifyContent: 'center',
    },
    // 详情页面样式
    loadingContainer: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
    },
    loadingText: {
        fontSize: 18,
        color: '#666',
    },
    errorContainer: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
    },
    dateRangeContainer: {
        padding: 12,
        backgroundColor: '#f8f9fa',
        borderRadius: 8,
        borderWidth: 1,
        borderColor: '#e0e0e0',
    },
    dateText: {
        fontSize: 16,
        color: '#333',
        textAlign: 'center',
    },
    reasonsContainer: {
        padding: 12,
        backgroundColor: '#f8f9fa',
        borderRadius: 8,
        borderWidth: 1,
        borderColor: '#e0e0e0',
    },
    reasonItem: {
        marginBottom: 8,
    },
    reasonText: {
        fontSize: 16,
        color: '#333',
    },
    destinationsContainer: {
        padding: 12,
        backgroundColor: '#f8f9fa',
        borderRadius: 8,
        borderWidth: 1,
        borderColor: '#e0e0e0',
    },
    destinationText: {
        fontSize: 16,
        color: '#333',
        textAlign: 'center',
    },
    workArrangementContainer: {
        padding: 12,
        backgroundColor: '#f8f9fa',
        borderRadius: 8,
        borderWidth: 1,
        borderColor: '#e0e0e0',
    },
    workArrangementText: {
        fontSize: 16,
        color: '#333',
        lineHeight: 24,
    },
    remarkContainer: {
        padding: 12,
        backgroundColor: '#f8f9fa',
        borderRadius: 8,
        borderWidth: 1,
        borderColor: '#e0e0e0',
    },
    remarkText: {
        fontSize: 16,
        color: '#333',
        lineHeight: 24,
    },
    reasonDetailContainer: {
        marginBottom: 20,
        padding: 16,
        backgroundColor: '#f8f9fa',
        borderRadius: 8,
        borderWidth: 1,
        borderColor: '#e0e0e0',
    },
    reasonDetailTitle: {
        fontSize: 18,
        fontWeight: 'bold',
        color: '#333',
        marginBottom: 16,
        textAlign: 'center',
    },
    detailItemContainer: {
        marginBottom: 16,
        padding: 12,
        backgroundColor: '#fff',
        borderRadius: 8,
        borderWidth: 1,
        borderColor: '#ddd',
    },
    detailRow: {
        flexDirection: 'row',
        marginBottom: 8,
        alignItems: 'flex-start',
    },
    detailLabel: {
        fontSize: 14,
        fontWeight: 'bold',
        color: '#555',
        width: 100,
        marginRight: 8,
    },
    detailText: {
        fontSize: 14,
        color: '#333',
        flex: 1,
        lineHeight: 20,
    },
    // 审批意见模块样式
    approvalSection: {
        marginTop: 20,
        marginBottom: 20,
    },
    approvalDivider: {
        flexDirection: 'row',
        alignItems: 'center',
        marginBottom: 16,
    },
    approvalDividerText: {
        fontSize: 18,
        fontWeight: 'bold',
        color: '#333',
        marginRight: 12,
    },
    approvalDividerLine: {
        flex: 1,
        height: 1,
        backgroundColor: '#ddd',
    },
    approvalItem: {
        flexDirection: 'row',
        alignItems: 'flex-start',
        marginBottom: 16,
        padding: 12,
        backgroundColor: '#f8f9fa',
        borderRadius: 8,
        borderWidth: 1,
        borderColor: '#e0e0e0',
    },
    approvalLabel: {
        fontSize: 16,
        fontWeight: 'bold',
        color: '#333',
        width: 120,
        marginRight: 12,
    },
    approvalValue: {
        fontSize: 16,
        color: '#666',
        flex: 1,
        fontStyle: 'italic',
    },
    // 下一步模块样式
    nextStepSection: {
        padding: 12,
        marginTop: 20,
        marginBottom: 20,
    },
    nextStepTitle: {
        fontSize: 18,
        fontWeight: 'bold',
        color: '#333',
        marginBottom: 16,
    },
    nextStepItem: {
        marginBottom: 16,
    },
    nextStepLabel: {
        fontSize: 16,
        fontWeight: 'bold',
        color: '#333',
        marginBottom: 8,
    },
    approverSelectionContainer: {
        flexDirection: 'row',
        flexWrap: 'wrap',
        gap: 8,
        marginBottom: 12,
    },
    selectedApprover: {
        flexDirection: 'row',
        alignItems: 'center',
        backgroundColor: '#e3f2fd',
        paddingHorizontal: 12,
        paddingVertical: 8,
        borderRadius: 20,
        borderWidth: 1,
        borderColor: '#2196f3',
    },
    selectedApproverText: {
        fontSize: 14,
        color: '#1976d2',
        marginRight: 8,
    },
    removeApproverButton: {
        width: 20,
        height: 20,
        borderRadius: 10,
        backgroundColor: '#f44336',
        justifyContent: 'center',
        alignItems: 'center',
    },
    removeApproverText: {
        color: '#fff',
        fontSize: 12,
        fontWeight: 'bold',
    },
    selectApproverButton: {
        backgroundColor: '#2196f3',
        paddingHorizontal: 16,
        paddingVertical: 8,
        borderRadius: 6,
        flexDirection: 'row',
        alignItems: 'center',
    },
    selectApproverButtonText: {
        color: '#fff',
        fontSize: 14,
        fontWeight: 'bold',
        marginLeft: 4,
    },
    noApproverText: {
        fontSize: 14,
        color: '#999',
        fontStyle: 'italic',
        textAlign: 'center',
        padding: 20,
    },
    // 草稿相关样式
    draftNotice: {
        backgroundColor: '#e8f5e8',
        borderColor: '#4caf50',
        borderWidth: 1,
        borderRadius: 8,
        padding: 12,
        margin: 16,
        marginBottom: 8,
    },
    draftNoticeText: {
        color: '#2e7d32',
        fontSize: 14,
        textAlign: 'center',
        fontWeight: '500',
    },
    draftButton: {
        backgroundColor: '#fff',
        borderColor: '#2196f3',
        borderWidth: 1,
        paddingVertical: 12,
        paddingHorizontal: 24,
        borderRadius: 8,
        alignItems: 'center',
        marginBottom: 12,
    },
    draftButtonText: {
        color: '#2196f3',
        fontSize: 16,
        fontWeight: 'bold',
    },
    // 禁用状态样式
    disabledOpacity: {
        opacity: 0.6,
    },
    // 地点类型选择样式
    locationTypeContainer: {
        marginBottom: 12,
    },
    checkboxRow: {
        flexDirection: 'row',
        justifyContent: 'flex-start',
        alignItems: 'center',
        paddingVertical: 8,
    },
    // 重试按钮样式
    retryButton: {
        backgroundColor: '#2196f3',
        paddingVertical: 8,
        paddingHorizontal: 16,
        borderRadius: 6,
        marginTop: 8,
        alignSelf: 'center',
    },
    retryButtonText: {
        color: '#fff',
        fontSize: 14,
        fontWeight: '500',
    },
})